<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TMALL sliderbar</title>
    <link rel="icon" href="images/favicon.ico">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/sliderbar.css">
</head>
<body>
    <div id="sideWrap">
        <div id="sliderbar">
            <div class="" id="user">
                <span class="glyphicon glyphicon-user"></span>
            </div>

            <div class="item" id="shop-cart">
                <span class="glyphicon glyphicon-shopping-cart"></span>
                <div>购物车</div>
                <span id="shop-cart-num">0</span>
            </div>

            <div class="item" id="asset">
                <span class="glyphicon glyphicon-yen"></span>
                <div class="tag">我的资产</div>
            </div>

            <div class="item" id="brand">
                <span class="glyphicon glyphicon-heart-empty"></span>
                <div class="tag">我关注的品牌</div>
            </div>

            <div class="item" id="collect">
                <span class="glyphicon glyphicon-star-empty"></span>
                <div class="tag">我的收藏</div>
            </div>

            <div class="item" id="foot">
                <span class="glyphicon glyphicon-time"></span>
                <div class="tag">我看过的</div>
            </div>

            <div class="item" id="charge">
                <span class="glyphicon glyphicon-inbox"></span>
                <div class="tag">我要充值</div>
            </div>

            <div   class="info">
                <div class="item" id="feedback">
                    <span class="glyphicon glyphicon-pencil"></span>
                    <div class="tag">用户反馈</div>
                </div>

                <div class="item" id="weixin">
                    <span class="glyphicon glyphicon-th"></span>
                </div>
            </div>
        </div>

        <div class="bar-content" id="shop-cart-content">
            <span class="closeBar glyphicon glyphicon-menu-left"></span>
            <span>购物车</span>
        </div>

        <div class="bar-content" id="asset-content">
            <span class="closeBar glyphicon glyphicon-menu-left"></span>
            <span>我的资产</span>
        </div>


        <div class="bar-content" id="brand-content">
            <span class="closeBar glyphicon glyphicon-menu-left"></span>
            <span>关注的品牌</span>
        </div>

        <div class="bar-content" id="collect-content">
            <span class="closeBar glyphicon glyphicon-menu-left"></span>
            <span>我的收藏</span>
        </div>

        <div class="bar-content" id="foot-content">
            <span class="closeBar glyphicon glyphicon-menu-left"></span>
            <span>我看过的</span>
        </div>

        <div class="bar-content" id="charge-content">
            <span class="closeBar glyphicon glyphicon-menu-left"></span>
            <span>我要充值</span>
        </div>

        <div class="bar-content" id="feedback-content">
            <span class="closeBar glyphicon glyphicon-menu-left"></span>
            <span>用户反馈</span>
        </div>

        <div class="bar-content" id="weixin-content">
            <span class="closeBar glyphicon glyphicon-menu-left"></span>
            <span>用户反馈</span>
        </div>
    </div>

    <script src="js/jquery.min.js"></script>
    <script src="js/sliderbar.js"></script>
</body>
</html>